<template>
  <div>
    <el-dialog title="编辑角色" :visible.sync="editdialogVisible" :before-close="close" width="600px">
      <el-form style="padding-right: 45px;" :model="roleModel" ref="roleModel" label-width="100px" class="demo-roleModel">
        <el-form-item label="角色名">
          <el-input v-model="roleModel.name" disabled=""></el-input>
        </el-form-item>
        <el-form-item label="角色描述">
          <el-input v-model="roleModel.description"></el-input>
        </el-form-item>
      </el-form>
      <div class="dialog-footer text-center mt-3">
        <el-button type="primary" @click="submitForm('roleModel')">确认</el-button>
        <el-button @click="close">取消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  props: ["editdialogVisible", "roleModel"], //接受父组件的值
  data() {
    return {};
  },

  created() {},

  methods: {
    submitForm: function(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          let editModel = {
            roleId: this.roleModel.id,
            name: this.roleModel.name,
            description: this.roleModel.description
          };
          this.$api.post("/api/Role/update", editModel,true).then(rsp => {
            if (rsp != false) {
              this.close();
              this.$emit("successEditRole");
            }
          });
        }
      });
    },

    close() {
      this.$emit("closeEditRole");
    }
  }
};
</script>



